<head>
    <title>登录页面</title>
    <link href="/lego/static/css/bootstrap.css" rel="stylesheet"/>
    <link href="/lego/static/css/xcConfirm.css" rel="stylesheet"/>
    <script src="/lego/static/js/jquery.1.11.3.min.js"></script>
    <script src = "/lego/static/js/bootstrap.js" ></script>
    <script src="/lego/static/js/underscore-min.js"></script>
    <script src="/lego/static/js/common.js"></script>
    <script src="/lego/static/js/xcConfirm.js"></script>
    <style>
       #mainDiv{
           border: 1px solid rgb(220,220,220);
           background-color: white;
           margin-left: 700px;
           margin-right: 300px;
           margin-top: 150px;
           padding-left: 80px;
           padding-top: 30px;
           border-radius: 10px;
       }
        .titleDiv h3{
            margin-left:80px;
            margin-top: 0px;
            color: lightslategray;
        }
        .imgDiv{
            width: 5px;
            padding-top: 10px;
        }
        .inputDiv{
            width: 220px;
        }
        .loginBtn{
            font-size: 16px;
            width:100px;
            margin-left: 18px;
        }
       div#div1{
           position:fixed;
           top:0;
           left:0;
           bottom:0;
           right:0;
           z-index:-1;
       }
       div#div1 > img {
           height:100%;
           width:100%;
           border:0;
       }
    </style>
    <script type="text/javascript">
        $(function () {
            $("#loginBtn").click(function(){
                //参数校验
                var formJson = $("#userForm").toJSON();
                if(formJson["userName"] == ""){
                    $("#errorMsg").html("用户名不能为空!!!");
                    return;
                }
                if(formJson["pwd"] == ""){
                    $("#errorMsg").html("密码不能为空!!!");
                    return;
                }
                $.ajax({
                    url: '/lego/userLogin',
                    type: 'POST',
                    data:$("#userForm").toJSONString(),
                    contentType:'application/json;charset=UTF-8',
                    success: function (data) {
                        if (data && data.code == 200) {
                            var op = {
                                title: "提示信息",
                                btn: window.wxc.xcConfirm.btnEnum.ok,
                            }
                            if(data.msg == "登录成功"){
                                window.location.href = "/lego/homeIndex";
                            }else {
                                $("#errorMsg").html(data.msg);
                            }
                        }
                    }
                });
            });
            $("#registerBtn").click(function () {
                window.location.href = "/lego/userRegisterIndex";
            })
        });
    </script>
</head>
<body>
    <div id="div1"><img src="/lego/static/img/background09.jpeg" /></div>
    <div id="mainDiv">
        <div class="form-group titleDiv">
            <h3>用户登录</h3>
        </div>
        <form method="post" class="form-horizontal" id="userForm">
            <div class="form-group">
                <div class="col-sm-4 imgDiv">
                    <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                </div>
                <div class="col-sm-4 inputDiv">
                    <input type="text" class="form-control" placeholder="用户名" name="userName" id="userName"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-4 imgDiv">
                    <span class="glyphicon glyphicon-lock" aria-hidden="true"></span>
                </div>
                <div class="col-sm-4 inputDiv">
                    <input type="password" class="form-control" placeholder="密码" name="pwd" id="pwd"/>
                </div>
            </div>
            <div id="errorMsg" style="color: red"></div>
            <br/>
            <div class="form-group">
                <button class="btn btn-success loginBtn" type="button" id="loginBtn">登录</button>
                <button class="btn btn-primary loginBtn" type="button" id="registerBtn" >去注册</button>
            </div>
        </form>
    </div>
</body>
